<?xml version="1.0" encoding="UTF-8"?>
<ui:decorate  template="/xhtml/plantillas/baseSeguridad.xhtml"
              xmlns:p="http://primefaces.org/ui"
              xmlns:h="http://java.sun.com/jsf/html"
              xmlns:f="http://java.sun.com/jsf/core"
              xmlns:ui="http://java.sun.com/jsf/facelets">    

    <ui:define name="titulo">Pagos de un Usuario</ui:define>

    <ui:define name="java_script">
    </ui:define>   

    <ui:define name="contenido">

        <h:outputText value="#{label['pagos.usuarios']}" class="encabezado"/>              
        <hr id="horizontalLine" style="width: 770px; margin-left: 20px"/> 
        <h:panelGrid columns="10" class="panelFormulario" >
            <p:accordionPanel  style="margin-top: 20px; width: 770px" >  
                <p:tab title="Datos Pago">         

                    <p:fieldset legend="Consulta Pagos">
                        <p:panelGrid>
                            <p:row>
                                <p:column>
                                    <h:outputText  styleClass="etiqueta" value="#{label['cliente']}" escape="false"/>
                                </p:column> 
                                <p:column>  
                                    <p:inputText id="id_cliente" value="#{beanPagosUsuarios.identificacion_u}" disabled="true"/>                                    
                                </p:column>
                                <p:column>                        
                                    <p:commandButton icon="ui-icon-info" title="Cliente" onclick="dcliente.show();" 
                                                     type="button" style="margin-left: 10px">
                                    </p:commandButton>                                                     
                                </p:column>   
                                <p:column>  
                                    <p:inputText id="id_dsc_cliente" value="#{beanPagosUsuarios.dscUsuario}"
                                                 style="width: 300px" disabled="true" rendered="#{beanPagosUsuarios.dscUsuario eq null  ? false : true}"/>                                    
                                </p:column>                                                                
                            </p:row>                                        
                            <p:row>
                                <p:column>
                                    <h:outputText  styleClass="etiqueta" value="#{label['fecha']}" />               
                                </p:column>
                                <p:column>
                                    <p:calendar style="width:10px" id="input_fecha_ant" effect="slide"
                                                readonlyInput="true" value="#{beanPagosUsuarios.fecha}"
                                                pattern="dd/MM/yyyy" navigator="true" maxlength="10">
                                        <p:ajax event="dateSelect" update=":form_conci" listener="#{beanPagosUsuarios.cargarPagosUsuario()}"/>
                                    </p:calendar> 
                                </p:column>
                            </p:row>     
                            <p:row>
                                <p:column>
                                    <h:outputText  styleClass="etiqueta" value="#{label['tipo.pago']}" escape="false"/>
                                </p:column>                           
                                <p:column>
                                    <p:selectOneMenu id="id_tipo"  value="#{beanPagosUsuarios.tipo_pago}"
                                                     effect="fold" style="width: 150px">  
                                        <p:ajax event="change" update=":form_conci" listener="#{beanPagosUsuarios.cargarPagosUsuario()}"/>
                                        <f:selectItem itemLabel="" itemValue=""  />  
                                        <f:selectItem itemLabel="Efectivo" itemValue="E" />  
                                        <f:selectItem itemLabel="Electronico" itemValue="T" />              
                                        <f:selectItem itemLabel="Cheque" itemValue="C" />              
                                    </p:selectOneMenu>                                     
                                </p:column>                    
                            </p:row>                                  
                        </p:panelGrid>
                    </p:fieldset>                    
                    <p:column><p:commandButton value="Limpiar" icon="ui-icon-arrow-4-diag" action="#{beanPagosUsuarios.limpiar()}"
                                               update=":form_conci"  style="margin-left: 600px" /></p:column>                    
                </p:tab>  
            </p:accordionPanel>  
        </h:panelGrid>        
        <p:fieldset legend="Lista de pagos" style="width: 755px" >
            <p:dataTable id="dataTable" var="pago" 
                         rows="5" value="#{beanPagosUsuarios.listado_pagos}"                           
                         rowsPerPageTemplate="10,15,20"                      
                         rowKey="#{pago.especialidad}"
                         paginator="true"
                         sortBy="#{pago.fecha}"
                         filterEvent="enter"
                         paginatorPosition="bottom">                  

                <p:column headerText="#{label['cliente']}" style="width: 200px; text-align: center" filterBy="#{pago.nombre_cliente}" filterMatchMode="contains">                      
                    <h:outputText value="#{pago.nombre_cliente}" />  
                </p:column>  
                <p:column headerText="#{label['especialidad']}" style="width: 150px; text-align: center" filterBy="#{pago.especialidad}" filterMatchMode="contains">                      
                    <h:outputText value="#{pago.especialidad}" />  
                </p:column>  

                <p:column headerText="#{label['plan.pago']}" style="width: 200px; text-align: center" filterBy="#{pago.plan_pago}" filterMatchMode="contains" >                      
                    <h:outputText value="#{pago.plan_pago}" />  
                </p:column> 

                <p:column headerText="#{label['fecha']}" style="width: 100px; text-align: center" filterBy="#{pago.fecha}" filterMatchMode="contains" >                      
                    <h:outputText value="#{pago.fecha}" />  
                </p:column> 

                <p:column headerText="#{label['monto']}" style="width: 150px; text-align: center" filterBy="#{pago.monto}" filterMatchMode="contains" >                      
                    <h:outputText value="#{pago.monto}" >
                        <f:converter converterId="NumeroConverter" />
                        <f:attribute name="patron" value="#,##0.00"/> 
                    </h:outputText>  
                </p:column> 

                <p:summaryRow >  
                    <p:column colspan="4" style="text-align:right">  
                        Total:  
                    </p:column>  

                    <p:column style="text-align:right">  

                        <h:outputText value="#{beanPagosUsuarios.total}" >
                            <f:converter converterId="NumeroConverter" />
                            <f:attribute name="patron" value="#,##0.00"/>  
                        </h:outputText> 
                    </p:column>  
                </p:summaryRow>                  
            </p:dataTable>  
        </p:fieldset>
        <p:dialog id="id_lista_clientes" header="Lista de usuarios" widgetVar="dcliente" 
                  showEffect="clip" hideEffect="explode" modal="true" >  
            <p:dataTable id="dataTableClientes" var="usuario" style="width: 750px" 
                         rows="5" value="#{beanPagosUsuarios.listado_persona_usuario}"                           
                         rowsPerPageTemplate="5,10,15" selectionMode="single" 
                         selection="#{beanPagosUsuarios.persona_usuario_tabla}"
                         rowKey="#{usuario.identificacion}"
                         paginator="true"
                         filterEvent="enter"
                         paginatorPosition="bottom">  

                <p:ajax  event="rowSelect"  update=":form_conci" 
                         listener="#{beanPagosUsuarios.seleccionarUsuario()}"/>

                <p:column headerText="Nombre" filterBy="#{usuario.nombre}" style="text-align: center" filterMatchMode="contains">                      
                    <h:outputText value="#{usuario.nombre}" />  
                </p:column>  

                <p:column headerText="Primer Apellido" filterBy="#{usuario.apellido1}" style="text-align: center" filterMatchMode="contains">                      
                    <h:outputText value="#{usuario.apellido1}" />  
                </p:column>  

                <p:column headerText="Segundo Apellido" filterBy="#{usuario.apellido2}"  style="text-align: center" filterMatchMode="contains">                      
                    <h:outputText value="#{usuario.apellido2}" />  
                </p:column>  

                <p:column headerText="Identificación" filterBy="#{usuario.identificacion}" style="text-align: center" filterMatchMode="contains">                      
                    <h:outputText value="#{usuario.identificacion}" />  
                </p:column>  
            </p:dataTable>              
        </p:dialog>        
    </ui:define>
</ui:decorate>
